@font-face {
  font-family: TieXianHei;
  src: url('./HYTieXianHei-35J.ttf');
}

code {
  font-family: "Cascadia Code", "TheSansMono", monospace;
  font-weight: 300;
  font-size: 90%;
}

/**
 * General settings such as fonts and background
*/

body {

  font-family: "Optima", "TieXianHei", serif;
  vertical-align: baseline;

  font-weight: 200;
  /* letter-spacing: -0.03rem; */

  background-color: #FFFFF8;

  margin: 20px 20px;
}

a{
  text-decoration: none;
  
  color: rgb(58, 102, 102);
  transition: color 0.16s ease-in;
}
a:hover {
  color: rgb(143, 77, 77);
}

main {
  max-width: 500px;
}

/* title */

.site-title {
  font-size: 300%;
  font-weight: 700;
  letter-spacing: -0.15rem;
}


/* blog entry / pages related */

.article-list {
  width: 500px;
  padding-top: 100px;
}

.article-entry {
  padding-bottom: 50px;
}

.article-link {

  font-size: 200%;
  font-weight: 700;
  letter-spacing: -0.05rem;
  margin-bottom: -5px;
}

.article-tldr {
  width: 500px;
  padding-left: 0.1rem;
  font-weight: 200;
}

/* Content related */

p {
  font-size: 108%;
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-ideograph;
}

li {
  padding-bottom: 10px !important;
}

/* code */
pre {

  line-height: 1.5;

  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 1em;
  overflow-x: auto;
}

/* misc elements */
img, iframe, video { max-width: 100%; }
main { hyphens: auto; }
blockquote {
  background: #f9f9f9;
  border-left: 5px solid #ccc;
  padding: 3px 1em 3px;
}

table {
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
}
table thead th {
  border-bottom: 1px solid #ddd;
}
th, td { padding: 5px; }
thead, tfoot, tr:nth-child(even) { background: #eee; }
